<template>
  <div class="index">
    <!--    <div class="index-top">
          <Tab :end-val="100" title="成交订单总数"/>
          <Tab :end-val="2000" title="成交订单金额"/>
          <Tab :end-val="60" title="下单用户总数"/>
        </div>-->
    <el-row :gutter="20">
      <el-col :lg="6" :md="8" :sm="8" :xl="6" :xs="8">
        <Monitorcar :number='12' color='#9830FA' icon='OrderSvg' name='成交订单总数'/>
      </el-col>
      <el-col :lg="6" :md="8" :sm="8" :xl="6" :xs="8">
        <Monitorcar :number='12' color='#F85E1F' icon='MoneySvg' name='成交订单金额'/>
      </el-col>
      <el-col :lg="6" :md="8" :sm="8" :xl="6" :xs="8">
        <Monitorcar :number='12' color='#0C99FD' icon='RegistrationSvg' name='下单用户总数'/>
      </el-col>
<!--      <el-col :lg="6" :md="12" :sm="12" :xl="6" :xs="12">
        <Monitorcar :number='12' color='#A233A2' icon='DealSvg' name='今日下单数量'/>
      </el-col>-->
      <el-col :lg="24" :md="24" :sm="24" :xl="24" :xs="24" style="margin-bottom:20px;">
        <TradingLine/>
      </el-col>
      <el-col :lg="12" :md="24" :sm="24" :xl="12" :xs="24">
        <OrderLine/>
      </el-col>
      <el-col :lg="12" :md="24" :sm="24" :xl="12" :xs="24">
        <WatchLine/>
      </el-col>
    </el-row>
  </div>
</template>

<script>

import Tab from "@/components/Index/Tab"
import TradingLine from "@/components/Index/TradingLine";
import OrderLine from "@/components/Index/OrderLine";
import WatchLine from "@/components/Index/WatchLine";
import Monitorcar from "@/components/analyze/monitorcar"
import {getUsers} from "@/http/api/user"

export default {
  data() {
    return {}
  },
  components: {Tab, TradingLine, OrderLine, WatchLine, Monitorcar},
  methods: {
    async getUsers() {
      const result = await getUsers({})
      console.log(result, "@@@@")
    }
  },
  mounted() {
    this.getUsers()
  }
}
</script>
<style lang="scss" scoped>
.index {
  background: #F5F7F9;
  padding: 15px;
  box-sizing: border-box;
  width: 100%;
  min-height: 100%;
}

.index-top {
  background-color: #fff;
  height: 120px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  margin-bottom: 20px;
}


</style>

